<template>
	<view class="content">
		<view class=" top" @click="toLogin">
			<view class="switch" style="text-align: right;margin-bottom: 100rpx;" v-if="userInfo.nickname"
				@click="navigateTo('/pages/tab4/setpage')">设置</view>
			<view class="bet" style="">
				<view class="flex">
					<view class="img" @click.stop="changehead">
						<image :src="
				    userInfo.avatar
				      ? userInfo.avatar
				      : '../../static/tab2/headImg.png'
				  " />
					</view>
					<view class="name">
						<view style="margin-bottom: 20rpx">{{
				  userInfo.nickname || "未登录"
				}}</view>
						<!-- <view style="font-size: 24rpx; width: 300rpx">
							企业： {{ companysText.join(" ") || "暂未选择" }}
						</view> -->
					</view>
				</view>
				<!-- <view class="switch" @click="show = true"> 切换企业 </view> -->
			</view>

		</view>
		<view class="boxItem flex boxTop" style="margin-top: -50rpx">
			<view class="caozuo" @click="navigateTo('/pages/tab4/improveData')">
				<view class="img">
					<image src="../../static/tab4/wanshan.png" alt="" />
				</view>
				<view class="title">完善资料</view>
			</view>
			<!-- is_lz 0在职，1离职 -->
			<view class="caozuo" @click="navigateTo('/pages/tab4/advance')"
				v-if="userInfo.nickname && userInfo.user_sn && userInfo.is_lz==0">
				<view class="img">
					<image src="../../static/tab4/yuzhi.png" alt="" />
				</view>
				<view class="title">预支工资</view>
			</view>
			<view class="caozuo" @click="navigateTo('/pages/tab4/payroll')"
				v-if="userInfo.nickname && userInfo.user_sn">
				<!--  -->
				<view class="img">
					<image src="../../static/tab4/gongzi.png" alt="" />
				</view>
				<view class="title">工资条</view>
			</view>
			<view class="caozuo" @click="navigateTo('/pages/tab4/myrecruit')" v-if="userInfo&& userInfo.is_sqzp == 1">
				<view class="img">
					<image style="border-radius: 38rpx;" src="../../static/tab4/recruit.png" alt="" />
				</view>
				<view class="title">我的招聘</view>
			</view>
			<view class="caozuo" @click="navigateTo('/pages/tab4/recruit')" v-if="userInfo&& userInfo.is_sqzp == 1">
				<view class="img">
					<image style="border-radius: 38rpx;" src="../../static/tab4/recruit.png" alt="" />
				</view>
				<view class="title">发布招聘</view>
			</view>
		</view>
		<view class="boxItem flex boxBottom" style="justify-content: flex-start;flex-wrap: wrap;">
			<view class="flexcenter" style="width: 20%;">
				<view class="caozuo flexcolumn margin_top" @click="navigateTo('/pages/tab4/messageList')">
					<view class="img">
						<image src="../../static/tab4/message.png" alt="" />
					</view>
					<view class="mesNum" v-if="messageNum.length != 0">{{messageNum.length}}</view>
					<view class="title">消息</view>
				</view>
			</view>
			<view class="flexcenter" style="width: 20%;">
				<view class="caozuo flexcolumn margin_top" @click="hetong">
					<view class="img">
						<image src="../../static/tab4/hetong.png" alt="" />
					</view>
					<view class="title">合同</view>
				</view>
			</view>
			<view class="flexcenter" style="width: 20%;" v-if="userInfo.is_bx==1">
				<view class="caozuo flexcolumn margin_top" @click="jumpurl('/pages/tab4/baoxiaoList')">
					<view class="img">
						<image src="@/static/tab4/baoxiao.png" alt="" />
					</view>
					<view class="title">财务</view>
				</view>
			</view>
			<view class="flexcenter" style="width: 20%;" v-if="userInfo.is_bxdk==1 || userInfo.is_bxfhy==1 || userInfo.is_bxjl==1 || userInfo.is_bxzg==1">
				<view class="caozuo flexcolumn margin_top" @click="jumpurl('/pages/tab4/baoxiaosp')" >
					<view class="img">
						<image src="@/static/tab4/shenpi.png" alt="" />
					</view>
					<view class="title">财务审批</view>
				</view>
			</view>
			<view class="flexcenter" style="width: 20%;" v-if="sm_status!=0">
				<view class="caozuo flexcolumn margin_top" @click="uploadImg">
					<view class="img">
						<image src="@/static/tab4/znsm.png" alt="" />
					</view>
					<view class="title">智能扫描</view>
				</view>
			</view>
			<!-- <view
	      class="caozuo"
	      @click="navigateTo('/pages/tab4/hetong/contractCopy')"
	    >
	      <view class="img">
	        <image src="../../static/tab4/hetong.png" alt="" />
	      </view>
	      <view class="title">合同</view>
	    </view> -->
			<view class="flexcenter" style="width: 20%;" v-if="sm_status!=0" >
				<view class="caozuo flexcolumn margin_top" @click="xiangce" >
					<view class="img">
						<image src="@/static/tab4/smxc.png" alt="" />
					</view>
					<view class="title">扫描相册</view>
				</view>
			</view>
			<view class="flexcenter" style="width: 20%;" v-if="userInfo.is_sqdl">
				<view class="caozuo flexcolumn margin_top" @click="navigateTo('/pages/tab4/dailijs')">
					<view class="img">
						<image src="@/static/tab4/znsm.png" alt="" />
					</view>
					<view class="title">代理结算</view>
				</view>
			</view>
			<view class="flexcenter" style="width: 20%;" v-if="userInfo.is_yjnb">
				<view class="caozuo flexcolumn margin_top" @click="navigateTo('/pages/tab4/neibao')">
					<view class="img">
						<image src="@/static/tab4/bx.png" alt="" />
					</view>
					<view class="title">壹家内保</view>
				</view>
			</view>
			<view class="flexcenter" style="width: 20%;" v-if="userInfo.kq_open==1">
				<view class="caozuo flexcolumn margin_top" @click="navigateTo('/pages/tab4/kaoqindk/kaoqindk')">
					<view class="img">
						<image src="@/static/tab4/kqdk.png" alt="" />
					</view>
					<view class="title">考勤打卡</view>
				</view>
			</view>
			<view class="flexcenter" style="width: 20%;" v-if="userInfo.is_sp==1">
				<view class="caozuo flexcolumn margin_top" @click="navigateTo('/pages/tab4/kaoqindk/shenpiqj')">
					<view class="img">
						<image src="@/static/tab4/qjsp.png" alt="" />
					</view>
					<view class="title">请假审批</view>
				</view>
			</view>
			<view class="flexcenter" style="width: 20%;" v-if="userInfo.is_sp==1">
				<view class="caozuo flexcolumn margin_top" @click="navigateTo('/pages/tab4/kaoqindk/shenpibk')">
					<view class="img">
						<image src="@/static/tab4/qjsp.png" alt="" />
					</view>
					<view class="title">补卡审批</view>
				</view>
			</view>
			<view class="flexcenter" style="width: 20%;">
				<view class="caozuo flexcolumn margin_top" @click="navigateTo('/pages/tab4/yongjin')">
					<view class="img">
						<image src="@/static/tab4/yongjin.png" alt="" />
					</view>
					<view class="title">钱包</view>
				</view>
			</view>
			<!-- <view class="flexcenter" style="width: 20%;">
				<view class="caozuo flexcolumn margin_top" @click="scancode">
					<view class="img">
						<image src="@/static/tab4/scan.png" alt="" />
					</view>
					<view class="title">扫码加群</view>
				</view>
			</view> -->
			<!-- <view class="caozuo" style="margin-right: 30rpx;" v-if="userInfo.is_sqdl" @click="navigateTo('/pages/tab4/tianjiacy')">
				<view class="img">
					<image src="@/static/tab4/tjcy.png" alt="" />
				</view>
				<view class="title">添加成员</view>
			</view> -->
			<!-- <view class="caozuo" @click="zxBtn" v-if="islogin">
				<view class="img">
					<image src="../../static/zhuxiao.png" alt="" />
				</view>
				<view class="title">注销</view>
			</view> -->
			<view class="caozuo margin_top" v-if="!islogin">
				<view class="img">
					<image src="" alt="" />
				</view>
				<view class="title"></view>
			</view>
		</view>
		<u-modal :show="htshow" title="合同编码" confirmText="确认" confirmColor="#c1282d" @confirm="chongzhi" cancelText="取消"
			@cancel="htshow=false
			" showCancelButton>
			<view class="slot-content" style="width: 600rpx;">
				<view class="flexbetween margin_top">
					<view class="main_size bold hei_text">合同编码：</view>
					<input type="number" style="text-align: right;" placeholder="请输入合同编码" v-model="htcode">
				</view>
			</view>
		</u-modal>
		<u-popup :show="show" @close="close">
			<view style="padding: 20rpx">
				<u-checkbox-group v-model="companysValue" :borderBottom="true" placement="column" iconPlacement="right">
					<u-checkbox :customStyle="{ marginBottom: '16px' }" v-for="(item, index) in companys" :key="index"
						:label="item.name" :name="item.id">
					</u-checkbox>
				</u-checkbox-group>
			</view>
		</u-popup>

		<!-- 自定义tabbar---start -->
		<!-- 	<u-tabbar
		:value="value1"
		@change="change1"
		:fixed="false"
		:placeholder="false"
		:safeAreaInsetBottom="false"
	>
		<u-tabbar-item text="首页" icon="home" @click="click1" ></u-tabbar-item>
		<u-tabbar-item text="放映厅" icon="photo" @click="click1" ></u-tabbar-item>
		<u-tabbar-item text="直播-" icon="play-right" @click="click1" ></u-tabbar-item>
		<u-tabbar-item text="我的" icon="account" @click="click1" ></u-tabbar-item>
	</u-tabbar> -->
		<!-- 自定义tabbar---end -->
		<view class="flexcenter" v-if="islogin">
			<view class="fabu">
				<!-- <view class="flexcolumn xiaohui smalltext">
					<text>Copyright@2020-2025</text>
					<text>智慧聘shiyijia.vip 版权所有</text>
				</view> -->
				<button @click="outLogoBtn" class="button margin_top">退出登录</button>
			</view>
		</view>
		<moDal :message="modal" @modalSure="modalSure" @modalcancel="modalcancel"></moDal>
		<tabbar :current="3" ref="tabbarRef"></tabbar>
	</view>
</template>

<script>
	const PPPHOTO = uni.requireNativePlugin('PP-PHOTO');
	const httpRequest = require("@/common/httpRequest.js")
	import {
		BASE_URL
	} from '../../env';
	export default {
		name: "tab-1",
		data() {
			return {
				show: false,
				checked: [],
				userInfo: {},
				groupId: 1,
				companys: [],
				companysValue: [5, 8],
				//横向两端排列形式
				user_sn: "", //用户工号
				messageNum: [], //未读信息数量

				value1: "",
				// 合同
				htshow: false,
				htcode: "",
				modal: {
					modalShow: false,
					title: "是否确认退出登录?",
				},
				islogin: false,
				sm_status:""

			};
		},
		onLoad() {
			uni.hideTabBar()
		},
		onShow() {
			this.islogin = httpRequest.checkIsLogin();
			if (this.islogin) {
				this.init();
				this.getshow()
			} else {
				this.userInfo = {}
			}
		},
		watch:{
			htshow(newval){
				if(newval==false){
					this.htcode = ""
				}
			}
		},
		computed: {
			companysText() {
				const text = [];
				this.companysValue.map((item) => {
					const list = this.companys.filter((items) => items.id === item);
					text.push(list[0]?.name);
				});
				return text;
			},
		},
		methods: {
			scancode(){
				// #ifdef APP-PLUS
				uni.scanCode({
					success: function(res) {
						// console.log('条码类型：' + res.scanType);
						// console.log('条码内容：' + res.result);
						httpRequest.request("/webim/message_box/addGroup", 'GET', {
							groups_id:res.result
						}, false, false, true).then(res => {
							httpRequest.toast(res.msg)
						})
					}
				});
				// #endif
				// #ifdef H5
				httpRequest.request("/webim/message_box/addGroup", 'GET', {
					groups_id:3
				}, false, false, true).then(res => {
					httpRequest.toast(res.msg)
				})
				// #endif
			},
			changehead(value, upImgs,upImgs_text) {
				if (!uni.getStorageSync("token")){
					uni.navigateTo({
						url: "/pages/login/applogin",
					});
					return false
				} 
				let _this = this;
				uni.showActionSheet({
					itemList: ['相机', '相册'],
					success: function(res) {
						// 选择相机走0
						if (res.tapIndex == 0) {
							httpRequest.chooseImage(1, ['camera']).then(res => {
								for (var i = 0; i < res.length; i++) {
									_this.uploadImageService(res[i], upImgs,upImgs_text)
								}
							}).catch(err => {});
						}
						// 选择相册走1
						if (res.tapIndex == 1) {
							httpRequest.chooseImage(1, ['album']).then(res => {
								for (var i = 0; i < res.length; i++) {
									_this.uploadImageService(res[i], upImgs,upImgs_text)
								}
							}).catch(err => {});
						}
					},
					fail: function(res) {}
				});
			},
			uploadImageService(url, upImg,upImgs_text) {
				let _this = this;
				httpRequest.uploadFile('/api/common/upload', url).then(res => {
					let image_item = res.fullurl;
					this.userInfo.avatar = image_item
					this.changeheadapi(res.url)
					
				}).catch(err => {});
			},
			changeheadapi(avatar){
				httpRequest.request("/api/user/profile", 'GET', {
					avatar
				}, false, false, true).then(res => {})
			},
			xiangce(){
				uni.navigateTo({
					url:"/pages/tab4/saomiaoxc"
				})
			},
			uploadImg() { //上传图片
				let _this = this;
				uni.showActionSheet({
					itemList: ['相机', '相册'],
					success: function(res) {
						// 选择相机走0
						if (res.tapIndex == 0) {
							httpRequest.chooseImage(1, ['camera']).then(res => {
								for (var i = 0; i < res.length; i++) {
									uni.navigateTo({
										url: "/pages/tab4/saomiao?url=" + res[i]
									})
								}
							}).catch(err => {});
						}
						// 选择相册走1
						if (res.tapIndex == 1) {
							httpRequest.chooseImage(1, ['album']).then(res => {
								for (var i = 0; i < res.length; i++) {
									uni.navigateTo({
										url: "/pages/tab4/saomiao?url=" + res[i]
									})
								}
							}).catch(err => {});
						}
					},
					fail: function(res) {}
				});
			},
			saomiao() {
				uni.navigateTo({
					url: "/pages/tab4/saomiao"
				})
			},
			init() {
				this.$nextTick(function() {
					this.$refs.tabbarRef.$emit("childmethod")
				});
				this.getUserAuth();
				this.companysValue = uni.getStorageSync("companysValue") || [];
			},
			getshow(){
				httpRequest.request("/api/user/exportData", 'GET', {
				}, false, false, true).then(res => {
					this.sm_status = res.data.sm_status
				})
			},
			zxBtn() {
				this.modal.title = "是否确认注销?"
				this.modal.modalShow = true

			},
			outLogoBtn() {
				this.modal.title = "是否确认退出登录?"
				this.modal.modalShow = true

			},
			yinsi() {
				uni.navigateTo({
					url: '/pages/login/xy?type=2'
				})
			},
			modalSure() {
				let _this = this;
				if (this.modal.title == "是否确认退出登录?") {
					uni.clearStorageSync();
					// uni.navigateTo({
					// 	url:"/pages/login/login"
					// })
					this.userInfo = {};
					this.islogin = false;
				} else {
					httpRequest.request('/api/user/zxUser', 'GET', {

					}).then(resp => {
						if (resp.code == 1) {

							uni.removeStorageSync('token');
							uni.removeStorageSync('user_id');
							this.userInfo = {};
							this.islogin = false;
							httpRequest.toast(resp.msg)
							// setTimeout(() => {
							// 	_this.init();
							// }, 1000)
						} else {
							httpRequest.toast(resp.msg)
						}
					})
				}
				this.modalcancel()
			},
			modalcancel() {
				this.modal.modalShow = false
			},
			change1(e) {
				console.log("change1", e);
			},
			hetong() {
				if (!uni.getStorageSync("token")) {
					this.toLogin();
					return;
				}
				this.htshow = true
			},
			chongzhi() {
				if (this.htcode == "") {
					httpRequest.toast("请输入合同编码")
					return false
				}
				this.htshow = false
				httpRequest.request('/api/user/htCodeYz', 'GET', {
					code: this.htcode,
				}, false, false, true).then(res => {
					if (res.code == 1) {
						uni.navigateTo({
							url: "/pages/tab4/hetonglb"
						})
					} else {
						httpRequest.toast(res.msg)
					}
				})
			},
			close() {
				this.show = false;
				uni.setStorageSync("companysValue", this.companysValue);
			},

			getMessage() {
				//获取消息列表，从而判断是否有信息未读
				let params = {
					user_sn: this.user_sn
				};
				this.http.get("/messages/getList", params)
					.then((res) => {
						if (res.code != 1) {
							return;
						}
						this.messageNum = [];
						if (Array.isArray(res.data)) {
							res.data.forEach((ele) => {
								if (ele.is_read == 1) {
									this.messageNum.push(ele.is_read);
								}
							})
						};

					})
					.catch((err) => {
						console.log("获取消息列表-失败");
						console.log(err);
					});
			},

			async getUserAuth() {
				if (!uni.getStorageSync("token")) return;
				const data = await this.http.get("user/getUerInfo");
				console.log('=========', data);
				this.groupId = data.data.group_id;
				console.log(data.data.companys, "data.data.companys");
				this.companys = data.data.companys;
				let str = data.data.avatar;
				let avatarUrl = ';'
				if (str.indexOf("http") !== -1) {
					avatarUrl = str;
				} else {
					avatarUrl = BASE_URL + str;
				}
				this.userInfo = {
					avatar: avatarUrl,
					nickname: data.data.username || data.data.nickname,
					is_sqzp: data.data.is_sqzp || data.data.is_sqzp,
					user_sn: data.data.user_sn,
					is_sqdl: data.data.is_sqdl,
					is_yjnb:data.data.is_yjnb,
					is_bx: data.data.is_bx,
					is_bxdk: data.data.is_bxdk,
					is_bxfhy: data.data.is_bxfhy,
					is_bxjl: data.data.is_bxjl,
					is_bxzg:data.data.is_bxzg,
					is_lz:data.data.is_lz,
					kq_open:data.data.company?data.data.company.kq_open : 0,
					is_sp:data.data.is_sp,
					is_zc:data.data.is_zc,
				};

				this.user_sn = data.data.user_sn;
				this.getMessage(); //获取信息列表
			},
			toLogin() {
				if (uni.getStorageSync("token")) return;
				uni.navigateTo({
					url: "/pages/login/applogin",
				});
			},
			navigateTo(url) {
				if (!uni.getStorageSync("token")) {
					this.toLogin();
					return;
				}
				uni.navigateTo({
					url: url,
				});
			},
		},
	};
</script>
<style lang="scss" scoped>
	.fabu {
		position: fixed;
		bottom: 150rpx;
		width: 92%;
	}

	.top {
		height: 400rpx;
		background-color: #c1282d;
		padding: 0 30rpx;

		.name {
			color: #ffffff;
			font-size: 36rpx;
			margin-left: 30rpx;
		}

		.img {
			width: 160rpx;
			height: 160rpx;

			image {
				width: 100%;
				height: 100%;
				border-radius: 100rpx;
			}
		}
	}

	.switch {
		color: #ffffff;
	}

	.caozuo {

		// margin-right: 60rpx;
		view {
			text-align: center;
		}

		.title {
			font-size: 28rpx;
			margin-top: 15rpx;
			font-weight: 300;
		}

		.img {
			width: 100rpx;
			height: 100rpx;

			image {
				width: 100%;
				height: 100%;
			}
		}
	}

	.mesC {
		position: relative;
	}

	.mesNum {
		position: absolute;
		top: -15rpx;
		left: 75rpx;
		background-color: #c1282d;
		color: #fff;
		max-width: 60rpx;
		height: 40rpx;
		min-width: 40rpx;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		font-size: 20rpx;
		box-sizing: border-box;
		padding: 6rpx;
		border-radius: 20rpx;
		text-align: center;
	}

	.boxBottom {
		display: flex;
		// flex-flow: row wrap;
		justify-content: space-between;
		align-items: flex-start;
	}

	.boxTop {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
	}
</style>